<template>
    <div>
        <h2>会员充值页面</h2>
        <table class="table table-bordered">
            <tr>
                <td>余额</td>
                <td>
                    <input type="text" v-model="state.Money"/>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="radio" name="use" v-model="money" value="支付宝"/>支付宝
                    <input type="radio" name="use" v-model="money" value="现金"/>现金
                    <input type="radio" name="use" v-model="money" value="微信"/>微信
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="button" value="充值"  @click="chat"/>
                </td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { reactive,toRefs,onMounted } from 'vue';
import { useRouter, useRoute} from 'vue-router';
const router= useRouter()
const route=useRoute()

const data=reactive({
    state:{},
    money:'',
})
const {state,money}=toRefs(data)

onMounted(()=>{
    Updmoney();
})
//反填金钱
const Updmoney=()=>{
    axios({
        url:'/api/High/FantianId',
        method:'get',
        params:{
            Id:route.query.Id
        }
    })
    .then(res=>{
        console.log(res);
        state.value=res.data.data;
    })
    .catch(err=>{
        console.log(err);
    })
}


//let obj是声明变量
const chat=()=>{
    if(state.value.Money==='')
    {
        alert('余额不能为空');
        return;
    }
    let obj={
        Id:route.query.Id,
        money:state.value.Money
    }
    axios({
        url:'/api/High/ChongUpd',
        method:'put',
        params:obj
    })
    .then(res=>{
        console.log(res);
        if(res.data.data>0)
        {
            alert('充值成功');
            router.push('/ShowMember');
        }
        else
        {
            alert('充值失败');
            return;
        }
    })
    .catch(err=>{
        console.log(err);
    })
}

</script>
<style lang="scss" scoped>

</style>